import React, { useState, useEffect, useRef } from "react";
import Taro, { getCurrentPages, useRouter } from "@tarojs/taro";
import { View, Image, Video } from "@tarojs/components";
import { Nav } from "@/components";
import "./index.scss";
import { uploadToOss } from "../../../utils/upload";
import { useLogin } from "@/uses";
import { AttachVO } from "@/api/fatelove";
import api from '@/api/platform-support'
const UploadOss = () => {
  let dbClickRef = useRef(false);
  const [imgs, setImgs] = useState([] as AttachVO[]);
  const login = useLogin();
  useEffect(() => {
    console.log("demo-login", login)
  }, [login])

  const uploadPic = async () => {
    if (imgs.length == 0) {
      Taro.showToast({
        title: "没有要上传的资源",
        icon: "none"
      });
      return;
    }
    if (dbClickRef.current) {
      return;
    }
    dbClickRef.current = true;
    Taro.showLoading({
      title: "正在上传..."
    });
    //上传oss
    let privateOss = true;
    let imgsOss = [] as AttachVO[];
    if (imgs.length > 0) {
      //图片
      for (let i = 0; i < imgs.length; i++) {
        let resUpload = await uploadToOss(imgs[i].fileUrl || '', api.config.getCdnsignSecret);
        console.log("resUpload", resUpload)
        if (resUpload) {
          imgsOss.push({
            fileType: 1,
            fileUrl: resUpload as string,
            width: imgs[i].width,
            height: imgs[i].height,
            size: imgs[i].size ? imgs[i].size + "" : ""
          });
        }
      }
    }
  }
  const choosePic = () => {
    if (imgs.length == 9) {
      Taro.showToast({
        title: "最多只能上传9张",
        icon: "none"
      });
      return;
    }
    Taro.chooseImage({
      count: 9 - imgs.length,
      sizeType: ["compressed", "original"],
      sourceType: ["album", "camera"],
      success: async res => {
        let imgs: AttachVO[] = [];
        let hasGif = false;
        let filePaths = [...res.tempFiles];
        for (let i = 0; i < filePaths.length; i++) {
          imgs.push({
            fileType: 1,
            fileUrl: filePaths[i].path,
            size: filePaths[i].size + ""
          });
          Taro.getImageInfo({
            src: filePaths[i].path,
            success: function (res) {
              imgs[i].width = res.width;
              imgs[i].height = res.height;
            }
          });
        }
        setImgs(value => {
          return [...value, ...imgs];
        });
        Taro.hideLoading();
      },
      complete: res => { }
    });
  }

  return (
    <View className="index">
      <Nav title="uploadOss" />
      <View className="imgsBox flexR">
        {imgs &&
          imgs.map((item, index) => {
            return (
              <View className="item">
                <View
                  className="delete"
                >
                </View>
                <Image
                  src={item.fileUrl || ""}
                  className="item-img"
                  mode="aspectFill"
                />
              </View>
            );
          })}
      </View>
      <View onClick={choosePic}>点击添加图片+</View>
      <View onClick={uploadPic}>点击上传到oss</View>
    </View>
  );
};

export default UploadOss;
